<template>
  <div class="boxer" style="width:862px">
    <div class="line"></div>
    <!-- <div class="lister">
      <div class="subTitle">机构名称：</div>
      <div class="subCont">{{ form.officeName }}</div>
    </div> -->
    <div class="lister">
      <div class="subTitle">服务商编号：</div>
      <div class="subCont">{{ form.hkproCode }}</div>
    </div>
    <div class="lister">
      <div class="subTitle">推送地址：</div>
      <div class="subCont">{{ form.tradePushUrl }}</div>
    </div>
    <div class="lister">
      <div class="subTitle">海科推送密钥：</div>
      <el-input
        type="textarea"
        style="width: 700px"
        rows="5"
        maxlength="2048"
        show-word-limit
        @input="value=>{form.genKey=value.replace(/[\u4E00-\u9FA5]/g,'')}"
        v-model="form.genKey"
      />
    </div>
    <div style="border:1px solid #ccc; width:calc(100vw - 200px)" v-if="agtType=='渠道机构'"></div>
    <div class="qudao"  v-if="agtType=='渠道机构'">
      <div class="lister">
        <div class="subTitle">渠道机构推送地址：</div>
        <el-input
          type="textarea"
          style="width: 700px"
          rows="5"
          maxlength="512"
          show-word-limit
          @input="value=>{form.callbackUrl=value.replace(/[\u4E00-\u9FA5]/g,'')}"
          v-model="form.callbackUrl"/>
        
      </div>
      <div class="lister">
        <div class="subTitle">渠道aes密钥：</div>
        <div class="subCont">{{ aesKey }}</div>
        <el-button type="primary" class="buttons1" v-if="this.aesKey==''" @click="generateKey">生成密钥</el-button>
      </div>
      <div class="lister">
        <div class="subTitle">渠道md5密钥：</div>
        <div class="subCont">{{ md5Key }}</div>
      </div>
    </div>
    <div style="padding-left:20px;margin:0 auto;text-align: center;">
      <el-button  @click="bankUrl">返回</el-button>
      <el-button type="primary" @click="pushSuccess">完成</el-button>
    </div>
  </div>
</template>

<script>
import axios from "axios";
import https from '../../plugins/https.js'
export default {
  created() {
    this.officeUid = this.$route.query.officeUid;
    this.getData();
  },
  data() {
    return {
      agtType: this.$route.query.agtType,
      md5Key:"",
      aesKey:"",
      officeUid: "",
      form: {
       
      },
    };
  },
  methods: {
    getData() {
      axios
        .post("/api/office/getUpdateOfficeInfo", { officeUid: this.officeUid })
        .then((res) => {
          console.log("查询出来的数据");
          console.log(res);
          this.form = res.data.data;
          console.log(this.form)
          this.aesKey=this.form.aesKey?this.form.aesKey:""
          this.md5Key=this.form.md5Key?this.form.md5Key:""
        });
    },
    // 生成秘钥
    generateKey(){
      https.generateKey().then(res=>{
        if(res.data.code=="0000"){
          this.aesKey=res.data.aesKey
          this.md5Key=res.data.md5Key
        
          console.log(this.form)
          
        }else{
          layer.open({
            content: res.data.msg,
            skin: "msg",
            time: 1 //1秒后自动关闭
          });
        }
      })
    },
    pushSuccess() {
      if(this.form.genKey==''){
         layer.open({
          content:'海科推送密钥不能为空',
          skin: "msg",
          time: 1 //1秒后自动关闭
        });
        return false
      }
      if(this.form.callbackUrl==''){
         layer.open({
          content:'渠道机构推送地址不能为空',
          skin: "msg",
          time: 1 //1秒后自动关闭
        });
        return false
      }
      this.form.aesKey=this.aesKey
      this.form.md5Key=this.md5Key
      this.form.oemUid=this.$route.query.officeUid
      axios.post("api/office/pushKey", this.form).then((res) => {
        layer.open({
          content: res.data.msg,
          skin: "msg",
          time: 1 //1秒后自动关闭
        });
      })
      .catch((err) => {
        console.log(err);
      });
    },
    bankUrl(){
      this.$router.push("/homePage/mechanismaa");
    }
  },
};
</script>

<style scope>
.line {
  height: 30px;
}
.lister {
  display: flex;
  margin-bottom: 20px;
  position: relative;
}
.subTitle {
  color: #909399;
  width: 140px;
  text-align: right;
}
.subCont {
  color: #303133;
}
.buttons1{
  float: right;
  width: 100px;
  position: absolute;
  right: 0;
}
.qudao{
  float: left;
  margin-top: 10px
}
</style>